<template>
	<view class="">
		<view class="recommend bg-color">
			<view class="recommend-item">
				<image class="item-big" src="../../static/img/w1.jpg" mode=""></image>
				<view class="item-small">
					<image class="item-img" src="../../static/img/a1.jpeg" mode=""></image>
					<image class="item-img" src="../../static/img/a2.jpeg" mode=""></image>
					<image class="item-img" src="../../static/img/a3.jpeg" mode=""></image>
				</view>
			</view>

			<view class="recommend-item">
				<image class="item-big" src="../../static/img/w2.jpg" mode=""></image>
				<view class="item-small">
					<image class="item-img" src="../../static/img/a4.jpeg" mode=""></image>
					<image class="item-img" src="../../static/img/a5.jpeg" mode=""></image>
					<image class="item-img" src="../../static/img/a6.jpeg" mode=""></image>
				</view>
			</view>


		</view>




	</view>
</template>

<script>
</script>

<style scoped>
	.recommend {
		padding: 20rpx;
	}

	.recommend-item {
		display: flex;
		flex-direction: column;
		border-radius: 20rpx;
		overflow: hidden;
		margin: 20rpx 0;
	}

	.item-big {
		width: 100%;
		height: 300rpx;
	}

	.item-small {
		width: 100%;
		height: 240rpx;
	}

	.item-img {
		width: 33.33%;
		height: 240rpx;
	}
</style>